「bricks builder」
共 110 篇相关教程
Bricks 内容切换器：纯 CSS 方案（radio + :has 实现标签切换）
本教程教你用 100% 纯 CSS 在 Bricks 里实现内容切换器（content switcher）——在多个内容区块间切换显示，典型场景如价格表（pricing tables）切换、功能特性切换，不需要任何 JS…
ACF vs Meta Box：Bricks 自定义字段插件怎么选？
ACF 和 Meta Box 都能配合 Bricks 使用。本文从集成深度、动态标签、价格模式和大数据量性能四个维度对比，并按场景给出选择建议。
把任意自定义 WP_Query 循环接入 Bricks 查询循环
有时候我们需要用 Brickshttps://brickslabs.com/go/bricks 的查询循环功能做自定义文章循环，但又想用自己的 WP_Query 代码来获得更多灵活性。
Bricks 让元素输出 N 次（N = 自定义字段值）：Array 查询类型实战
Bricks 2.2 新增 Array 查询类型，配合 {echo:} 函数把元素按自定义字段的数值重复输出 N 次。付费原文锁定，官方钩子补全实现。
Bricks Tabs 自动轮播：滚动到可视区后自动切换标签页
给 Tabs (Nestable) 元素加自动轮播：元素进入视口后每隔 3 秒自动切到下一个标签页，离开视口自动暂停。基于 IntersectionObserver 与 setInterval，纯前端实现，免费教程完整代码。
手风琴展开项自动滚动到可视区（解决内容跳动问题）
长内容手风琴切换时页面高度突变、内容乱跳？先判断手风琴是否选错了组件，确需使用时用 20 行 JS 在展开完成后自动滚动到新展开的条目，免费教程完整代码。
Bricks Accordion (Nestable) 图标旋转：展开/收起状态箭头切换
Bricks 的 Accordion (Nestable) 元素展开前后图标完全一样，没有状态反馈。用两行 CSS 让箭头在展开时旋转 90 度，收起时转回，带平滑过渡动画。免费教程完整代码。
Bricks 编辑器界面微调合集（自定义 CSS）
本文是 Bricks 编辑器的一些可用微调合集，让日常建站更顺手。「更好」当然因人而异，不是每一条都适合所有人。
Bricks 建站从零到上线：完整实战指南（适配 Bricks 2.4）
从安装、基础设置到模板体系搭建的完整 Bricks 建站流程。每步都讲清楚为什么这么配、配完怎么验证，并标注 2.x 版本下的过时项——照着做，半天搭出可上线的站。
Oxygen 用户迁移 Bricks 生存指南
这里整理了一些给从 Oxygen 切换到（或考虑切换到）Bricks Builder 的用户的小贴士和常见问题解答。
如何把 Bricks 内容批量迁移到 Astro
要迁移几十个 Bricks 组件和页面到 Astro？一份可落手的批量转换工作流完整手册。
从 Bricks 迁移到 Astro：完整路线图
为什么要把 Bricks 站点迁到 Astro？一份完整路线图——架构取舍、内容搬运与部署，一次讲清。
Bricks vs Breakdance 2026：性能优先派的巅峰对决
Bricks 还是 Breakdance？本文对比 2026 年两个干净代码构建器的性能基准、价格模式、动态数据能力、WooCommerce 建站和工作流差异，给出选型建议。
Bricks vs Divi 2026：性能与控制力的对决
Bricks 还是 Divi？本文对比 2026 年两者的性能、价格、代码质量、动态数据、WooCommerce 能力和工作流，给出诚实的选型结论。
Bricks vs Elementor 2026：正面对决基准测试
Bricks 还是 Elementor？本文对比 2026 年两者的性能基准、价格、动态数据、交互、条件逻辑和 WooCommerce 能力，给出适合你的结论。
Bricks 分类与子分类 Query Loop Tabs：父分类做标签、子分类做内容
用 Bricks Tabs（Nestable）把顶级父分类做成标签页标题、对应子分类列表做成标签内容。付费原文锁定，给出官方钩子补全实现。
Bricks 条件输出教程（Conditions in Bricks Builder）
当时版本的 Brickshttps://brickslabs.com/go/bricks 还没有内置的条件（Conditions）功能——但这不代表不能用自定义代码手动实现。
Bricks 中使用 Core Framework
Core Frameworkhttps://coreframework.com/ 是一个免费 CSS 框架，可以独立使用（在他们官网的 webapp 里）。
在 Bricks Builder 中制作可自定义的 AJAX 加购按钮
在 Brickshttps://brickslabs.com/go/bricks 中，你可以用动态数据/函数 {woo_add_to_cart} 直接创建一个加购按钮。只要在 WooCommerce > Settings…
为 SureCart 产品制作自定义加购按钮（含加载动画与 Tooltip）
Brickshttps://brickslabs.com/go/bricks 对 SureCarthttps://brickslabs.com/go/surecart v3+ 的集成提供了现成的「加购按钮（Add-to-…
Bricks 滚动自定义动画：无需任何插件的 IntersectionObserver 方案
本教程提供一套 JavaScript + CSS 代码，让你在 Bricks Builderhttps://brickslabs.com/go/bricks 里实现滚动进入视口时触发的自定义 CSS 动画，全程不需要任何…
Bricks 自定义动态数据标签入门：把自定义标签加进『选择动态数据』列表
Bricks 里注册自己的动态数据标签，让自定义数据出现在动态数据选择器里。付费原文锁定，给出官方钩子补全实现（Parent link 案例）。
Bricks 自定义字段文本限字数动态标签：{custom_field_word_limit_字段名:数字}
给 ACF / Meta Box / JetEngine 的文本字段输出加字数限制并自动追加省略号。注册自定义动态数据标签，官方钩子补全实现。
WordPress 自定义图片字段头像
有时候你可能不想用 WordPress 内置的头像功能，而是改用图片类型自定义字段来做头像。
Bricks 构建器自定义键盘快捷键：单键插入元素 + Alt+H 切换 :hover
这篇文章提供一段代码，给 Bricks 编辑器配置几个自定义键盘快捷键，让建站工作流更快一些。
Bricks 自定义 WooCommerce 账户中心：完整搭建教程
有人在 Bricks Facebook 群https://www.facebook.com/groups/brickscommunity/posts/1311323746198809/里提问：
用 HappyFiles 做下载区
除了正在连载的「用 HappyFiles、Meta Box 和 Brickshttps://brickslabs.com/go/bricks 做自定义画廊与滑块」系列之外，作者还写了一个能输出指定文件夹所有子文件夹的代码…
Bricks 区块草稿状态控制：一键把区块设为「草稿」不渲染
Laurent Drapeau 在 Bricks Facebook 群组https://www.facebook.com/groups/brickscommunity/posts/1068186667179186/里分享…
Bricks 动态条件：仅当文章存在手动摘要（Excerpt）时才输出元素
Bricks 里用 {echo:函数} 动态条件判断文章是否手动填写了摘要，有才显示摘要区块。完整 PHP 函数 + 白名单 + 条件配置三步搞定。
Bricks Countdown 倒计时元素接入动态日期（bricks/element/settings 补全实现）
Bricks 自带 Countdown 元素的日期不支持动态数据，无法从自定义字段取值。用官方过滤器在渲染前把日期替换成 ACF Date Time Picker 字段值。付费教程，本文给骨架并用官方钩子补全实现。
Bricks 全站浮动元素：Section 模板 + wp_footer 钩子
需要在全站每页都显示一个浮动元素（回到顶部、悬浮联系按钮等）？用 Section 类型模板 + position: fixed + wp_footer 钩子，一次搭建全站生效，这是 Bricks 社区公认的理想做法。
GSAP 在 Bricks 中的实战案例：一个时间轴串起六种动画
在这篇教程里，我们要创建一个包含多种流行 GSAP 动画的自定义时间轴（timeline），并把它集成到 Bricks Builder 中。
HappyFiles 文件夹图片的 Bricks 查询循环：三种取图方案
这篇教程探索：用 HappyFileshttps://happyfiles.io/ 整理过的 WordPress 媒体库图片，如何通过 Bricks 的查询循环（query loop）拉取并展示出来。
给 Bricks Gallery 所有图片加自定义 Class（解决 Perfmatters 懒加载图片塌陷）
Perfmatters 懒加载会让 Gallery 图片互相塌陷叠在一起，而官方默认类名太通用没法精准定位。用官方过滤器给 Gallery 输出的每张图片追加专属 class，再在 Perfmatters 里指定它跳过懒加载。付费教程，本文补全实现。
Bricks 查询循环布局切换开关
这篇教程教你：当用户点击查询循环上方的图标切换按钮时，动态改变查询循环容器的布局。
Bricks 自适应桌面导航栏（溢出自动收纳到 More）
这篇教程教你：当桌面端导航栏溢出时，自动添加一个「More」菜单项。
如何在 Bricks 中用 RoughNotation.js 实现滚动标注动画
本教程提供可直接粘贴的 PHP 与 JS 代码，让你在 Brickshttps://brickslabs.com/go/bricks Builder 里用 RoughNotation 库https://github.co…
如何将 Bricks 的 Ctrl/Cmd+Shift+V 快捷键改为前端预览
Ctrl+Shift+V 在 Windows 里是「无格式粘贴」的常用快捷键。偏偏 Bricks 编辑器也用这组键来在前端查看当前正在编辑的页面/文章/模板。
用 ACF 和 Bricks 创建动态无限 Logo 轮播
本教程提供完整的构建器设置、PHP 与 CSS 代码，教你用纯 CSS 在 Bricks Builderhttps://brickslabs.com/go/bricks 里做出一个无限循环的 Logo 轮播——Logo …
在 Bricks 中创建网格轮播
本教程教你如何在 Brickshttps://brickslabs.com/go/bricks 默认的嵌套轮播（nested slider）里做出多行多列的网格布局。Bricks 的轮播底层用的是 SplideJShtt…
为 Bricks 嵌套轮播添加进度条
本教程教你如何给 Brickshttps://brickslabs.com/go/bricks 的嵌套轮播（nested slider）元素添加进度条，效果参考 SplideJS 官网的轮播进度示例https://spl…
在 Bricks 中使用 IsotopeJS 创建筛选器（第四部分）：AJAX 筛选与无限循环、排序、列表视图与禁用动画
本教程讲解在 Brickshttps://brickslabs.com/go/bricks 构建器里用 Isotope 实现：给无限滚动查询循环容器启用 AJAX 筛选、添加排序功能、添加列表视图切换器，以及禁用筛选时的…
从 Bricks 编辑器排除元素：bricks/builder/elements 过滤器详解
Bricks 提供了一个好用的 bricks/builder/elementshttps://academy.bricksbuilder.io/article/filter-bricks-builder-elements…
单次 AJAX 调用从 API 导入自定义文章：特色图 + 自定义字段
本教程将演示如何通过抓取一个公开 API，把一批电影（含图片和自定义字段）导入到自定义文章类型中。
通过 URL 参数 ?tab=xxx 直达 Bricks Tabs 指定标签页（补全实现）
分享链接想让访客直接打开第 2 个标签页？给 URL 加 ?tab=title-2 参数，页面加载时脚本按参数自动切换到对应标签。付费教程，本文给骨架并用官方 DOM 结构补全实现。
用 ACF 从 CPT 动态填充地图标记（Bricks 地图系列 PART 4：按分类术语过滤）
本教程提供 PHP 与 JS 代码，让你在 Brickshttps://brickslabs.com/go/bricks 构建器中实现：根据某个分类法（taxonomy）的术语（term）来过滤地图上的标记。
Bricks 中同步两个可嵌套轮播（主轮播 + 缩略图联动）
本教程教你如何在 Bricks 中同步两个可嵌套（nestable）轮播：一个作为主轮播，另一个作为缩略图轮播。
Bricks 中调用 API 入门（以 Chuck Norris 语录为例）
本教程通过从公共 API 拉取一条动态的 Chuck Norris 语录，带你掌握在 Bricks 中调用 API 的基础流程。
Bricks 中入门 GSAP（用 data 属性在构建器里管理动画）
本教程教你如何在 Bricks Builder 里，用特定 data 属性中的 JSON 对象运行基础 GSAP 动画。
Bricks 构建器快捷键添加元素
Advanced Themerhttps://advancedthemer.com/（下文简称 AT）打算加一个很实用的功能：按下 Cmd/Ctrl + Shift 会在右侧边栏的元素快捷键上显示数字，输入数字就会点击对…
Bricks 手风琴（Nestable）：第一项桌面端展开、移动端收起
在 Bricks Facebook 群https://www.facebook.com/groups/brickscommunity里，有用户提问：
Bricks Masonry 手风琴：Accordion（Nestable）里的瀑布流查询循环
在 Bricks 手风琴（Accordion Nestable）内的文章查询循环里启用 Masonry 瀑布流。付费原文锁定，给出基于 Isotope 的补全实现。
用麦当劳点餐理解 JavaScript Promise（订单承诺类比）
作者把这个类比改了一点、补充了更多细节，然后让 AI 补全。下面是最终成品——用麦当劳点餐来理解 Promise：
Bricks 输出 Meta Box 设置页里选中文章的数据（PHP 查询实现）
Meta Box 设置页的 Post 类型字段选了一篇文章，如何在页面上输出那篇文章的标题、正文和自定义字段？用 Bricks PHP 查询编辑器。付费原文锁定，给出补全实现。
从 Elementor/Divi 迁移到 Bricks：完整分步指南
手把手教你把 WordPress 站点从 Elementor、Divi 或 WPBakery 迁移到 Bricks——内容、设计系统、WooCommerce 与 SEO 全流程拆解。
把色板选择器移到颜色弹窗顶部
在 Bricks Facebook 群https://www.facebook.com/groups/brickscommunity/里，有用户提问：
Bricks 嵌套查询循环：按作者分组文章 + 手风琴展开（骨架+钩子补全）
Bricks 按作者分组展示文章的嵌套查询循环：外层循环作者、内层循环该作者文章。付费原文锁定，给出官方钩子补全实现。
Bricks 嵌套查询循环：每个分类各自的 Load More 按钮 + 剩余数量
分类分组嵌套循环里，每个分类的 Load More 互不干扰且带剩余篇数。付费原文锁定，给出基于官方钩子的补全实现思路。
[笔记] JavaScript 模块（ES6 Modules）
作者最近开始了转全栈开发的旅程，正在写一个系列，记录每天学到的东西。这篇关于 ES6 模块 的文章就是系列的第一篇。
用自定义链接/按钮/Div 打开 Bricks Offcanvas（brxe-toggle 类）
不想用汉堡图标触发 Offcanvas？给任意文本链接、Button 元素或自定义 Div 加上 brxe-toggle 类即可打开侧滑菜单；多个 Offcanvas 时用 data-selector 属性指定目标。免费教程零代码。
Bricks 嵌套查询循环：向上取任意层父级循环对象（Parent Query Loop Object）
嵌套查询里如何拿到任意层父级循环的对象（分类 ID、文章 ID 等）？两种方式：按元素 ID 取，或用自定义函数按层级动态取。付费原文锁定，官方钩子补全实现。
用 Bricks 做个人站：为什么独立开发者和自由职业者该有自己的站
个人站不是简历页——它是你的数字资产、获客入口和内容平台。这篇讲透个人站该放什么、用什么技术栈、怎么避免最常见的时间黑洞。
用按钮 data 属性填充 BricksExtras 弹窗中的 WS Form 表单字段
本教程演示如何把打开弹窗（Modal）的按钮/链接上的 data- 属性值，填充到 BricksExtrashttps://bricksextras.com/ 的 Modal 内 WS Formhttps://brick…
Bricks 相关文章：同作者的其他文章（PHP 查询编辑器实现）
单篇页展示当前文章作者写过的其他文章，排除当前文章。用 Bricks PHP 查询编辑器 + 动态数据 {author_meta:ID} {post_id} 一行参数搞定。
Bricks 查询结果数量标签 {query_results_count}：循环外也能判断有无结果
Bricks 1.9.1 起内置 {query_results_count:bricksid} 动态标签，可基于元素 ID 获取任意查询的结果数，在循环外做条件渲染，零代码。
在 Bricks 中查询以特定字母开头的文章
想在 Bricks 里显示所有以某个字母（比如 A）开头的文章？这篇教程给你方案。
把 Basic Text 元素默认 HTML 标签从 div 改成 p（复制元素法）
Bricks 的 Basic Text 元素默认输出 div，没有语义还烦人。通过把官方元素文件复制到子主题并修改默认值，再用 register_element 注册覆盖，让新元素默认输出 p。免费教程完整代码。
Bricks 吸顶元素：用 position: sticky 让任意元素滚动吸顶
想让页头或页面中部的某个区块滚动到顶部后吸住？用 CSS position: sticky 三个设置搞定，并借助 WordPress 管理员栏 CSS 变量自动避让工具栏，免费教程零代码。
Bricks 页脚滑动露出效果（Sticky Footer Reveal）
想让 Bricks 网站的页脚做出这种「滑动露出」的效果吗？——平时页脚藏在页面底部看不见，滚动到最底部时它才从下方滑出来，而不是一直占据页面空间。
WooCommerce 产品循环模板覆盖：用 Bricks 模板替换默认产品循环
Bricks 里的查询循环（query loop）确实强大又方便，但你也肯定不想把自定义的 WooCommerce 产品循环复制粘贴到每个页面里吧？有时候你用 Bricks 把 WooCommerce 设计得挺漂亮，可产…
Bricks 用 ACF Checkbox 字段渲染自定义 SVG 图标列表
把 ACF Checkbox 多选字段的值用 PHP 输出为列表，再用数据 URI 形式的 SVG 背景图替换默认圆点，做出带自定义图标的清单列表效果。
Bricks 按 ACF Gallery 图片数量做动态条件输出
通过自定义函数统计当前文章 ACF Gallery 字段的图片数量，再用 echo 动态数据标签在 Bricks 中按数量做条件显示，比如图片多时显示相册链接。
Bricks 查询循环输出 ACF 图片字段的 Alt、Caption、标题数据
ACF 图片字段存的是媒体库附件 ID，附件自带的 Alt、Caption、说明文字都能动态取出来。注册 4 个自定义动态标签，在服务/作品归档页的缩略图下方直接输出，1500 张图也不用手工填字段。
Bricks 中输出 ACF Relationship 关联文章的数量
用自定义函数统计当前文章 ACF Relationship 字段关联的文章数量，再通过 bricks/code/echo_function_names 白名单注册，在 Bricks 动态数据里直接输出数字。
ACF Relationship 字段 + Bricks 查询循环：显示关联文章
Bricks 自带 ACF Relationship 查询类型，但想自由控制排序、分页和输出结构时，用 PHP 查询循环更灵活。本文用 Game/Review 双 CPT 示例讲透 get_field 取关联 ID + post__in 的完整写法。
Bricks 查询循环按 ACF Repeater 子字段值筛选行
团队介绍页想按部门分开显示？ACF Repeater 的每一行都可以在 Bricks 查询循环里按子字段值筛选。用 bricks/query/run 过滤器，按元素 ID 区分多个循环，一个函数搞定所有筛选需求。
Bricks 按 ACF Repeater 子字段排序行
ACF Repeater 的行默认按录入顺序输出，想按某个子字段字母序或日期排序？bricks/query/run 过滤器里 usort 一行搞定，不碰构建器、不用改数据结构。
零代码：ACF Repeater 子字段值做成 Bricks Tabs 标签页
Bricks 的查询循环原生支持 ACF Repeater 和 Meta Box Group，配合可嵌套的 Tabs 元素，可以把 Repeater 的每一行变成标签页——标签标题取一个子字段、内容取另一个子字段，全程不用写一行代码。
Bricks 中按 Select 筛选值条件隐藏其他筛选器
访客在 Bricks 前端筛选器里选择某个下拉选项后，自动隐藏与该选项无关的其他筛选器（如范围滑块），避免用户误设互斥条件导致列表为空。
Bricks 用过滤器自定义面包屑（替换 Uncategorized 链接）
Bricks 的 bricks/breadcrumbs/items 过滤器可以程序化修改面包屑输出。例如把单篇文章面包屑里的 /Uncategorized/ 替换成首页链接，附 BricksExtras 面包屑的对应写法。
Bricks 按发布年份过滤文章（自动打年份标签 + WP Grid Builder 筛选）
让文章的发布年份自动成为自定义分类法的术语，再用 WP Grid Builder 在 Bricks 查询循环上按年份筛选。原文为付费教程，本文给出骨架并用 WP 官方钩子补全实现。
Bricks 前端按日期选择器字段过滤文章（URL 状态同步）
让访客通过日期选择器筛选任意文章类型的内容（如按活动日期筛选活动），支持 from/to/date 三种 URL 参数，并兼容浏览器前进后退。
Bricks 自定义查询类型：循环输出 Meta Box Checkbox List 值
Checkbox List 勾选的值是一个数组，Bricks 查询循环默认没法直接逐项输出。注册一个自定义查询类型，把数组的每一项变成一个循环项——这套模式能循环任意 PHP 数组，不止 Checkbox List。
Bricks 自定义查询类型：输出 Meta Box 可克隆字段
Meta Box 可克隆（Cloneable）字段存了一组同类型值，比如一门课的多个上课日期。注册自定义查询类型把它们变成循环项，用 Basic Text 等元素自由排版；再用计数标签做条件，没填值就整块不显示。
Bricks 嵌套查询循环：CPT 循环里套 Meta Box Group 循环
课程列表页上，每个课程下面要列出它自己的日程事件？外层查询循环查 CPT，内层查询循环用 Bricks 内置的 MB Group 类型读当前文章的 Group 字段——两层循环自动对齐，几乎不用写代码。
Bricks 输出 Meta Box 图片高级字段的随机一张图
用自定义函数把 Meta Box Image Advanced 字段的图片数组打乱后取一张，配合 echo 动态数据在 Bricks 中输出随机图片，适合横幅、背景或每日一图场景。
Meta Box Relationship 字段 + Bricks 查询循环：显示关联文章
Bricks 内置的 MB Relationship 查询类型之外，用 PHP 查询编辑器自己控制更灵活。rwmb_meta 取出关联 ID 数组，post__in 喂给查询循环，附带空值兜底和双向关联的设置方法。
Bricks 按 Meta Box Group 子字段排序文章
Order by 控件只能按顶层自定义字段排序，字段一旦包在 Group 里就没辙了。用 bricks/query/result 过滤器在结果层重排：取 ID、按子字段值比较、重建文章对象，有值的排前面，空值沉底。
Bricks Query Loop 三种三栏布局方案（Flexbox / CSS Grid / Masonry）
在 Bricks 里把 Query Loop 排成 3 列：Flexbox 原生无 CSS、CSS Grid 两种变量方案、column-count 瀑布流，附完整代码和断点配置。
WordPress 单篇文章页里给其他文章列表加 AJAX 分页
在单篇模板中显示一列文章并做 AJAX 分页，WordPress 原生做不到。用免费插件 Loops & Logic 几步搞定，含完整模板代码。
Bricks Query Loop 条件类名与 data 属性：库存大于 25 加 in-stock
给查询循环的每一项按条件加类名或 data 属性：自定义函数读 ACF/Meta Box 字段值并返回类名，配合白名单和 STYLE → ATTRIBUTES 实现。
Bricks Query Loop 高亮当前文章：给循环项加 data-current 属性
在单篇文章页的导航列表里高亮当前文章：自定义函数 bl_is_current_post 对比循环文章 ID 与当前文章 ID，输出 data-current 属性，纯 CSS 即可定位样式。
Bricks Query Loop：精选文章置顶且不重复（PHP 查询实现）
把最新 2 篇 ACF 精选文章排到 Query Loop 最前面，其余按日期排序且不重复。一套 PHP 查询搞定：分两步取 ID、合并数组、post__in 保持顺序。
Bricks Query Loop 按 Meta Box Group 的 Radio 子字段筛选文章
筛选出「会话类型」等于指定值的文章：Meta Box 可克隆组里套 Radio 子字段，用 meta_query LIKE 匹配 PHP 序列化串。附完整代码和原理。
HappyFiles 文件夹图片用 Bricks Query Loop 输出（三种方式）
把 HappyFiles 分类好的媒体库图片用 Bricks 查询循环展示：嵌套循环、单个 PHP 查询、BricksExtras Dynamic Lightbox 三套方案，附完整代码。
Bricks Query Loop 加载更多（Load More）按钮教程
Bricks 自带 AJAX Load More 功能，无需任何插件。本文演示如何在查询循环（Query Loop）上配置点击加载更多，以及 ACSS 用户必加的全局 CSS。
Bricks Query Loop 只输出自定义字段里指定的文章 ID
自定义字段存了一组文章 ID，查询循环只想输出这些文章。用 Bricks 的 PHP 查询编辑器一行代码搞定，无需自定义查询或钩子。
Bricks Templates Query Loop：在查询循环里显示模板截图
Bricks 1.10 起支持模板截图。本文用自定义函数回退到自动生成的模板截图，让模板库的 Query Loop 也能显示每张模板的缩略图。
Bricks Terms 查询按文章自定义字段过滤（公开职位案例）
在 Bricks 的 Terms 查询循环中，只显示关联了特定自定义字段值的文章所归属的术语。以职位可见性字段为例，通过 bricks/terms/query_vars 过滤术语列表。
Bricks Terms 查询预过滤：只输出未来年份（bricks/terms/query_vars）
在 Bricks 的 Terms 查询循环中按术语值本身过滤，例如活动年份分类法只显示未来的非空年份，通过 bricks/terms/query_vars 官方钩子实现。
Bricks 判断 WooCommerce 购物车是否为空（条件渲染）
根据购物车是否为空条件渲染元素：注册一个自定义函数并白名单化，再用 Bricks 动态数据条件 {echo:bl_is_cart_empty} 控制任意元素显示。
Bricks 将 WooCommerce 产品分类图片设为 Section 背景
在 WooCommerce 产品分类归档模板中，把分类缩略图作为 Section 背景图。注册一个返回分类图片 URL 的自定义函数，白名单化后用 {echo:...} 动态数据标签填进背景。
Bricks 打造自定义 WooCommerce 账户中心（My Account Dashboard）
WooCommerce 自带的 Account Page 元素很受限。用 Bricks 的账户构建器从零搭一个左侧固定导航 + 右侧内容区的自定义账户中心，含导航覆盖、链接配色与端点模板完整步骤。
Bricks 在 My Account 页面标题后追加 WooCommerce 端点名称
WooCommerce 的 My account 各端点页（订单/下载/地址/账户详情）标题都一样。用自定义函数识别当前端点并拼接后缀，让页面标题变成『订单 - Orders』这种可区分的文案。
Bricks 查询循环只显示促销中（On Sale）的 WooCommerce 产品
在 Bricks Query Loop 中只输出正在促销的产品。原文为付费教程，本文给出场景与步骤骨架，并用 Bricks 官方钩子 bricks/posts/query_vars 补全实现。
Bricks 按 WooCommerce 产品属性值条件渲染元素
WooCommerce 产品属性本质是 taxonomy，可以在 Bricks 里按属性值做元素条件判断。例如属性 color=Red 时显示某个视频/区块。含 :plain 过滤器说明。
Bricks 让 WooCommerce 数量输入框与加入购物车按钮并排
WooCommerce 单产品页默认数量输入框和加入购物车按钮上下排列。用一段 Flex 布局 CSS 让它们水平并排，无需改模板。
Bricks 用 Popup + 交互做 WooCommerce 商品快速预览
不装插件，用 Bricks 自带的 Popup 模板和 Interactions 交互给商品网格加快速预览：点击按钮弹出灯箱，展示图片、价格、简介与加购按钮。
Bricks 移除 WooCommerce 产品图库中的特色图片
WooCommerce 单产品页图库默认把特色图也算进去。用 woocommerce_single_product_image_thumbnail_html 过滤器把特色图从图库中剔除，只显示附加图库图片。
WooCommerce 滚动吸顶 Add to Cart 区块（Bricks）
在 Bricks 中构建一个滚动时吸顶的加入购物车区块，包含产品图、标题、价格、数量与购买按钮，下滑淡入、回顶淡出，纯构建器实现无需插件。